// 1. React核心库
import React, { useState, useEffect } from 'react';

// 2. UI组件库 - 按字母顺序
import { Card, Form, Input, Button, message, Select, Switch } from 'antd';

// 3. 图标库
import { SaveOutlined, ArrowLeftOutlined } from '@ant-design/icons';

// 4. 专业组件库
import { PageContainer } from '@ant-design/pro-components';

// 5. 工具库
import { useParams, history } from '@umijs/max';

// 7. 项目内部模块
import { apiClients } from '@/services/apiClient';
import { autoLoginInDev } from '@/utils/autoLogin';

// 8. 生成的类型定义 (必须使用，禁止手工定义)
import type { AIRole, AIRoleRequest } from '@/services/generated';

const { TextArea } = Input;
const { Option } = Select;

const AIRoleEdit: React.FC = () => {
  const { id } = useParams<{ id: string }>();
  const [form] = Form.useForm();
  const [loading, setLoading] = useState(false);
  const isEdit = !!id;

  // 角色分类选项
  const categoryOptions = [
    { value: 'assistant', label: '通用助手' },
    { value: 'creative', label: '创作写作' },
    { value: 'analysis', label: '分析总结' },
    { value: 'education', label: '教育培训' },
    { value: 'programming', label: '编程开发' },
    { value: 'business', label: '商务办公' },
    { value: 'entertainment', label: '娱乐休闲' },
    { value: 'custom', label: '自定义' },
  ];

  // 获取角色详情（编辑模式）
  useEffect(() => {
    if (isEdit && id) {
      const fetchData = async () => {
        try {
          await autoLoginInDev();
          const response = await apiClients.aiChat.aiChatRolesRetrieve({ id });
          form.setFieldsValue({
            ...response.data,
          });
        } catch (error) {
          message.error('获取角色数据失败');
        }
      };
      fetchData();
    }
  }, [id, isEdit, form]);

  const onFinish = async (values: any) => {
    try {
      setLoading(true);
      await autoLoginInDev();

      const formData: AIRoleRequest = {
        ...values,
      };

      if (isEdit) {
        await apiClients.aiChat.aiChatRolesUpdate({ 
          id: id!, 
          aIRoleRequest: formData 
        });
        message.success('更新成功');
      } else {
        await apiClients.aiChat.aiChatRolesCreate({ 
          aIRoleRequest: formData 
        });
        message.success('创建成功');
      }

      // 跳转到列表页
      history.push('/ai-chat/roles');
    } catch (error) {
      message.error(isEdit ? '更新失败' : '创建失败');
    } finally {
      setLoading(false);
    }
  };

  return (
    <PageContainer
      header={{
        title: isEdit ? '编辑AI角色' : '新建AI角色',
        subTitle: isEdit ? `编辑角色 #${id}` : '添加新的AI角色',
      }}
    >
      <Card>
        <Form<AIRoleRequest>
          form={form}
          layout="vertical"
          onFinish={onFinish}
          initialValues={{
            is_public: false,
            category: 'custom',
          }}
        >
          <Form.Item 
            name="name" 
            label="角色名称" 
            rules={[{ required: true, message: '请输入角色名称' }]}
          >
            <Input 
              placeholder="请输入角色名称，如：编程助手、创意写手等" 
              maxLength={100}
              showCount
            />
          </Form.Item>

          <Form.Item 
            name="category" 
            label="角色分类" 
            rules={[{ required: true, message: '请选择角色分类' }]}
          >
            <Select placeholder="请选择角色分类">
              {categoryOptions.map(option => (
                <Option key={option.value} value={option.value}>
                  {option.label}
                </Option>
              ))}
            </Select>
          </Form.Item>

          <Form.Item 
            name="system_prompt" 
            label="系统提示词"
            rules={[{ required: true, message: '请输入系统提示词' }]}
            tooltip="定义AI角色的行为和回答风格的核心指令"
          >
            <TextArea 
              rows={12}
              placeholder="请输入系统提示词，定义AI角色的行为模式、专业领域、回答风格等。&#10;&#10;例如：&#10;你是一个专业的编程助手，具有丰富的软件开发经验。你的任务是：&#10;1. 提供准确的代码建议和最佳实践&#10;2. 解释复杂的技术概念&#10;3. 帮助用户调试和优化代码&#10;4. 保持友好和耐心的态度"
              maxLength={5000}
              showCount
            />
          </Form.Item>

          <Form.Item 
            name="is_public" 
            label="公开状态"
            valuePropName="checked"
            tooltip="公开的角色可以被其他用户使用"
          >
            <Switch checkedChildren="公开" unCheckedChildren="私有" />
          </Form.Item>

          <Form.Item>
            <Button 
              type="primary" 
              htmlType="submit" 
              loading={loading}
              icon={<SaveOutlined />}
              style={{ marginRight: 8 }}
            >
              {isEdit ? '更新' : '创建'}
            </Button>
            <Button 
              icon={<ArrowLeftOutlined />}
              href="/ai-chat/roles"
            >
              取消
            </Button>
          </Form.Item>
        </Form>
      </Card>
    </PageContainer>
  );
};

export default AIRoleEdit;